
<template>
<div class="root-box forten-dataview-down" id="root-box"  :style="{paddingRight: propDownType && propDownType == 'form' ? '0px' : '0px', width:  '100%'}">
    <!--对话框-->
    <div v-if="propFlagDialog || flagDialog">
      <el-button  ref="userinpEl" v-show="!propNoBtn" :disabled="btnClickDisabled" v-if="propClickType && propClickType =='button' " type="primary" @click="dialogVisible = true" >{{propClickTitle}}<i class="el-icon-d-caret el-icon--right"></i></el-button>
      <vxe-input id="userinpl" ref="userinpEl"  v-show="!propNoBtn" v-else :disabled="btnClickDisabled"   class="edit-down-input"
                 v-model="selectValue" suffix-icon="fa vxe-icon--funnel"
                 @click="show"  @suffix-click="show"
                 :clearable="propClear &&  propClear == true"
                 @clear="inpClear"
                 readonly title="请选择" placeholder="请选择"></vxe-input>
      <el-dialog
        title="请选择"
        :visible.sync="dialogVisible"
        :modal="true"
        :modal-append-to-body="false"
        @opened="show"
        class="dialog-top"
        id="dialog"
        width="88%" >
        <template #title>
          请选择
          <span v-if="strings.isNotBlank(useMsg)" >
            <i class="el-icon-info"></i>
            <span v-html="useMsg" class="use-msg"></span>
          </span>
        </template>
        <data-view class="data-view-select"  :propViewKey="viewKey" ref="dataViewSelect"
                   @extra-button-click="extraButtonClickForDown"
                   @current-change="currentChange"
                   @view-ready="viewReady"
                   :propAutoFetchData="false"
                   :propCustomCols="myPropCustomCols"
                   :propHideColumns="propHideColumns"
                   :propOnlyQuery="true"
                   :propShowFullSearch="viewKey == 'system_dv_define'"
                   :propShowChildCheckbox="showChildCheckbox"
                   @after-load="afterLoadExpandMethods"
        >
          <!--库存字段-->
          <template #stockCount="{row}" >
            <el-button-group>
              <el-button type="success" size="mini" round  v-if="row.stockCount > 0 ">{{row.stockCount}}</el-button>
              <el-button type="warning" size="mini" round  v-else>{{Number(row.stockCount)}}</el-button>
            </el-button-group>
          </template>

          <!--锁定数量字段-->
          <template #stockLockCount="{row}" >
            {{Number(row.stockLockCount)}}
          </template>

          <!--可用可用库存数量字段-->
          <template #canUseCount="{row}" >
            <el-button-group>
              <el-button type="success" size="mini" round  v-if="row.canUseCount > 0 ">{{row.canUseCount}}</el-button>
              <el-button type="warning" size="mini" round  v-else>{{Number(row.canUseCount)}}</el-button>
            </el-button-group>
          </template>
        </data-view>
      </el-dialog>
    </div>

  <!--下拉容器-->
  <div class="edit-down-table"  transfer v-else>
    <vxe-pulldown class="edit-down-pulldown"  ref="xDown" transfer :placement="placement" @hide-panel="hidePanelFun" >
      <template v-slot>
        <el-button ref="userinpEl"  :disabled="propDisabledInput || btnClickDisabled" v-if="propClickType && propClickType =='button'" type="primary" @click="show" >{{propClickTitle}}<i class="el-icon-d-caret el-icon--right"></i></el-button>

        <vxe-input id="userinp2" ref="userinpEl"  v-else-if="!propClear ||  propClear == false" :disabled="propDisabledInput || btnClickDisabled || btnClickDisabledOut"   :class="{'edit-down-input':true,'edit-down-input-readonly': btnClickDisabledOut} " className="autofocus-input"
                   v-model="selectValue" :suffix-icon="(propDisabledInput || btnClickDisabled || btnClickDisabledOut) ? '' : 'fa vxe-icon--funnel'"
                   @click="show"  @suffix-click="show" @focus="show"
                   readonly title="请选择" placeholder="请选择"></vxe-input>

        <vxe-input id="userinp3" ref="userinpEl"  v-else :disabled="propDisabledInput || btnClickDisabled || btnClickDisabledOut"   :class="{'edit-down-input':true,'edit-down-input-readonly': btnClickDisabledOut} "
                   v-model="selectValue" suffix-icon="fa vxe-icon--funnel"
                   @click="show"
                   :clearable="true"
                   @clear="inpClear"
                   readonly title="请选择" placeholder="请选择"></vxe-input>
      </template>
      <template v-slot:dropdown>
        <div class="my-dropdown4" v-show="dataViewShow">
          <div style="    height: 14px;font-size: 12px; line-height: 12px; padding-top: 3px;text-align: right;padding-right: 25px;color: #ff4d4f;" v-if="strings.isNotBlank(useMsg)" v-html="useMsg">
          </div>

          <el-popover
            placement="top"
            title="提示"
            width="200"
            trigger="hover" >
            <small>
              ↑↓移动行<br>
              F2勾选取消勾选行<br>
              F3确认选择<br>
              F4新增<br>
              (注意：至少要有一个控件聚焦)！
            </small>
            <i class="el-icon-question" slot="reference" style="    position: absolute;right: 4px; top: -3px;"></i>
          </el-popover>
          <!-- <span  @click='close()' style="float: right;"><el-button style="border: 0px; margin-top: -20px; margin-right: -10px;" size='medium ' icon='el-icon-close'></el-button></span> -->
          <data-view class="data-view-select"  :propViewKey="viewKey" ref="dataViewSelect"
                     @extra-button-click="extraButtonClickForDown"
                     @current-change="currentChange"
                     @checkbox-change="checkboxChange"
                     @checkbox-all="checkboxAll"
                     @view-ready="viewReady"
                     @after-load="afterLoadExpandMethods"
                     @reset="handlerReset"
                     :propAutoFetchData="false"
                     :propCustomCols="myPropCustomCols"
                     :propHideColumns="propHideColumns"
                     :propOnlyQuery="true"
                     :propShowFullSearch="viewKey == 'system_dv_define'"
                     :propHidePageSearch="false"
                     :propShowChildCheckbox="showChildCheckbox"
                     :style="{paddingTop: strings.isNotBlank(useMsg) ? '0px' : '11px'}"
          >
            <!--库存字段-->
            <template #stockCount="{row}" >
              <el-button-group>
                <el-button type="success" size="mini" round  v-if="row.stockCount > 0 ">{{row.stockCount}}</el-button>
                <el-button type="warning" size="mini" round  v-else>{{Number(row.stockCount)}}</el-button>
              </el-button-group>
            </template>

            <!--锁定数量字段-->
            <template #stockLockCount="{row}" >
              {{Number(row.stockLockCount)}}
            </template>

            <!--可用可用库存数量字段-->
            <template #canUseCount="{row}" >
              <el-button-group>
                <el-button type="success" size="mini" round  v-if="row.canUseCount > 0 ">{{row.canUseCount}}</el-button>
                <el-button type="warning" size="mini" round  v-else>{{Number(row.canUseCount)}}</el-button>
              </el-button-group>
            </template>
          </data-view>
        </div>
      </template>
    </vxe-pulldown>
  </div>
</div>
</template>

<script>
/*eslint-disable*/
/*下拉数据视图*/
export default {
  name: 'FortenDataviewDown',
  props: {
    params: Object,
    renderOpts: Object,

    //下拉类型，dataview：dataview单元格编辑，form：表单编辑
    propDownType:{
      type: String,
      default: 'dataview'
    },

    //非单元格编辑时，选择类型，radio：单选【默认】，checkbox:多选
    propCheckType:{
      type: String,
      default: 'radio'
    },

    //非单元格编辑时，文本框显示字段名
    propFieldText:{
      type: String,
      default: null
    },
    //非单元格编辑时，数据视图选择指定id
    propFieldId:{
      type: String,
      default: null
    },

    // dataview隐藏列
    propHideColumns: {
      type: Array,
      default: null
    },

    //非单元格编辑时，触发按钮类型  input:文本框【默认】，button：按钮
    propClickType:{
      type: String,
      default: 'input'
    },

    //非单元格编辑时，触发按钮类型为button时按钮的名字
    propClickTitle:{
      type: String,
      default: '请选择'
    },

    //非单元格编辑时，表单数据，比如：会将表单里面字段名是【propFieldText】的显示到文本框
    propForm:{
      type: Object,
      default: null
    },

    //非单元格编辑时，表格查询条件
    propTableQueries:{
      type: Object,
      default: null
    },
    //非单元格编辑时，固定参数
    propUserParam:{
      type: Object,
      default: null
    } ,

    //非单元格编辑时，是否显示为弹框，默认false
    propFlagDialog:{
      type: Boolean,
      default: false
    },


    //非单元格编辑时，是否禁用触发按钮
    propDisabledInput:{
      type: Boolean,
      default: false
    },

    //非单元格编辑时，触发按钮类型  input:文本框【默认】，button：按钮
    propNoBtn:{
      type: Boolean,
      default: false
    },
    //非单元格编辑时，所操作内容主键，有一些特殊用于，选择后将返回
    propPK:{
      type: String,
      default: null
    },


    //非单元格编辑时，是否可以清空文本框
    propClear:{
      type: Boolean,
      default: false
    },
    //非单元格编辑时，是否自动加载数据 默认true
    propAutoFetchData:{
      type: Boolean,
      default: true
    },
  },
  data() {
    return {
      viewKey: '',    //视图标识
      selectValue: '',    //文本框所选内容，只有单选时，才会有值
      //是否hi单选按钮
      isRadio: false,
      //触发按钮禁用状态，防止恶意重复点击
      btnClickDisabled: false,
      btnClickDisabledOut: false,

      //用户提示信息，会显示在操作区域顶部
      useMsg: null,
      //下拉框是否显示
      dialogVisible: false,

      //表格尺寸
      tbMainSize: '中',
      dataViewShow: false,//列表在加载完以后显示
      defalutColumnProperty: 'name', //默认显示属性
      childCols: [
        {type: 'seq', title: '序号'},
        {field: 'matrName', title: '耗材名称'},
        {field: 'matrSpec', title: '耗材规格'},
        {field: 'packageUnit', title: '包装单位'},
        {field: 'packageQty', title: '包装数量'},
        {field: 'skuUnit', title: '单品单位'},
        {field: 'skuPrice', title: '单品价格'},
        {field: 'skuQty', title: '单品数量'},
        {field: 'amount', title: '金额'}
      ],
      keepSelect: false,
      pkName: false,
      keepSelectList: [],
      tableBoxMaxH: 0,
      placement: 'bottom',

      flagDialog: false,
      //显示子网格复选框
      showChildCheckbox: false,
    }
  },
  watch:{
    //表单数据变化时
    propForm:{
      handler(newValue, oldValue) {
        this.bindValue()
        if (this.propDownType != 'form') {
          const { row, column } = this.params
          let primaryKey = this.renderOpts.props.dataview.primaryKey
          if (this.strings.isNotBlank(row[primaryKey]) && column.property == 'matrName') {  //有主键并且是耗材选择的
            this.btnClickDisabledOut = true
            return
          }
        }
        this.btnClickDisabledOut = false
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    //扩展按钮事件
    extraButtonClickForDown(para) {
      let buttonKey = para.button.key
      switch (buttonKey) {
        //关闭
        case 'close':
          this.close()
          break
        //确认选择
        case 'confirm':
          //多选时
          let rows = this.$refs.dataViewSelect.$refs.tbMain.getCheckboxRecords()
          if (rows && rows.length) {
            rows.forEach(row => {
              row = this.utils.appendParamForInterceptor(this, 'dataviewsave', row, row)
            })
          }
          if (this.keepSelectList && this.keepSelectList.length) {
            this.keepSelectList.forEach(row => {
              if (row) {
                row = this.utils.appendParamForInterceptor(this, 'dataviewsave', row, row)
              }
            })
          }
          if (!this.isRadio && (( rows && rows.length > 0) || (this.keepSelect && this.keepSelectList.length >0) )){
            if (this.propDownType == 'form') {//嵌套表单
              if (this.keepSelect) {
                this.$emit('select-change', {fieldText: this.propFieldText, rows: this.keepSelectList,fieldId:this.propFieldId})
              }else {
                this.$emit('select-change',{fieldText: this.propFieldText, rows: rows,fieldId:this.propFieldId})
              }
            }else { //单元格编辑时
              const {  column } = this.params
              this.propCheckFlowParam = this.renderOpts.props.dataview.propCheckFlowParam
              if (this.keepSelect) {
                let listObUnq = []
                let listIdUnq = []
                // this.keepSelectList.splice(this.keepSelectList.findIndex(row => row[this.pkName] == rowSel[this.pkName]), 1)
                this.keepSelectList.forEach(ob => {
                  if (ob && !listIdUnq.includes(ob[this.pkName])) {
                    listObUnq.push(ob)
                    listIdUnq.push(ob[this.pkName])
                  }
                })

                this.renderOpts.props.dataview.$emit('select-change', {rows: listObUnq, column})
              }else {
                this.renderOpts.props.dataview.$emit('select-change', {rows, column})
              }
            }
          }
          this.close()
          break
        case 'clear':
          this.$refs.dataViewSelect.$refs.tbMain.clearAll()
          break
        default:
      }
    },
    afterLoadExpandMethods(rows) { //用于扩展表格的初始化
      //初始化模板
      rows.filter(row => this.strings.isNotBlank(row.packTempletId) && '-1' != row.packTempletId).forEach(row => {
        this.getPackTemplet(row)
      })

      //选中之前选择的
      if (this.keepSelect && this.keepSelectList.length > 0) {
        let tbMain = this.$refs.dataViewSelect.$refs.tbMain
        //设置选中

        tbMain.getTableData().tableData.forEach(dataRow => {
          let showRow = this.keepSelectList.find(row2 => row2[this.pkName] == dataRow[this.pkName])
          if (showRow) {
            let rowSel = tbMain.getRowById(dataRow._XID)
            tbMain.setCheckboxRow([rowSel], true)
          }
        })

        //去掉或选中行内选中样式
        this.$nextTick(() => {
          $(this.$refs.dataViewSelect.$el).find('.vxe-cell--checkbox').each(function(){
            let tr =  $(this).closest('tr')
            let checkBox = $(this)
            if (!checkBox.hasClass('is--checked')) {
              tr.removeClass('row-check')
            } else {
              tr.addClass('row-check')
            }
          })
        })
      }

      setTimeout(() => {
        //样式最大高度不变
        let tbMain = this.$refs.dataViewSelect.$refs.tbMain
        let tableBox = $(tbMain.$el).find('.vxe-table--body-wrapper')
        if (this.tableBoxMaxH ==0 ) this.tableBoxMaxH = tableBox.height()
        tableBox.css({'max-height':this.tableBoxMaxH+'px'})


        //底部位置不够时，面板朝上【即窗口高度-弹框上边距-弹框高度< 0】，这个情况，一般弹框会超出页面底部
        let pulldown = $(this.$refs.dataViewSelect.$el).closest('.vxe-pulldown--panel')
        if (pulldown.length > 0) {
          if (window.innerHeight - pulldown.offset().top - pulldown.outerHeight() < 0) {
            pulldown.css('top', window.innerHeight - pulldown.outerHeight() - 9 )
          }
          let maxH2 = window.innerHeight - pulldown.offset().top - 6
          pulldown.css('max-height', maxH2 + 'px')
          pulldown.css('height', maxH2 + 'px')
        }
        pulldown.css('overflow', 'auto')
      }, 100)
    },
    getPackTemplet(row) {
      let wrapper = this.$newWrapper().eq('packTempletId', row.packTempletId)
      wrapper.orderConditions.push({ field: 'matrName', rule: 'asc' })
      let params = {
        queryString: JSON.stringify(wrapper.queryConditions),
        orderString: JSON.stringify(wrapper.orderConditions)
      }
      this.$ajax.get('/base/pack_templet_item/list', {params}).then(resp => {
        row.childCols = this.childCols
        row.childData = resp.data
      })
    },
    //行选中之后，切换复选框状态
    currentChange(params){
      let tbMain = this.$refs.dataViewSelect.$refs.tbMain

      //单选直接关闭
      if(this.isRadio) {
        if (this.propDownType == 'form') {//嵌套表单
          if (this.propFieldText) {
            this.selectValue = params.row.row[this.propFieldText]
          }
          this.$emit('select-change',{propPK: this.propPK, fieldText: this.propFieldText, columnProperty: this.strings.isNotBlank(this.selectValue) ? this.propFieldText : this.defalutColumnProperty, row: params.row.row,that: this})
        }else { //单元格编辑时
          const { renderOpts, row, column } = this.params
          this.selectValue = params.row.row[column.property]
          this.$set(column, 'selectRow', params.row.row)
          this.renderOpts.props.dataview.$emit('select-change', {row: row, column})
          this.renderOpts.props.dataview.activeNext()
          this.selectValue = this.selectValue || row[column.property]
          //自动聚焦到下个输入框
          let props = this.renderOpts.props
          let userParam = props.userParam[this.params.column.property]
          // if (userParam && userParam.nextFieldEditName)   props.dataview.focusEditCell(userParam.nextFieldEditName)
        }

        this.close()
      }else{
        let rowSel = tbMain.getRowById(params.row.rowid)
        this.$refs.dataViewSelect.$refs.tbMain.toggleCheckboxRow(rowSel)
        if (this.keepSelect) {
          let checked = tbMain.isCheckedByCheckboxRow(rowSel)
          if (checked) {
            this.keepSelectList.push(rowSel)
          } else {
            this.keepSelectList.splice(this.keepSelectList.findIndex(row => row[this.pkName] == rowSel[this.pkName]), 1)
          }
        }
      }
    },
    //复选按钮
    checkboxChange(param){
      let tbMain = this.$refs.dataViewSelect.$refs.tbMain
      if (this.keepSelect) {
        if (param.checked) {
          this.keepSelectList.push(param.row)
        } else {
          this.keepSelectList.splice(this.keepSelectList.findIndex(row => row[this.pkName] == param.row[this.pkName]), 1)
        }
      }
    },
    //全选
    checkboxAll(param){
      let tbMain = this.$refs.dataViewSelect
      if (this.keepSelect) {
        if (param.checked) {
          param.records.forEach(record => {
            let findIndex = this.keepSelectList.findIndex(row => row[this.pkName] == record[this.pkName])
            if (findIndex == -1) this.keepSelectList.push(record)
          })
        } else {
          tbMain.rows0.forEach(record => {
            this.keepSelectList.splice(this.keepSelectList.findIndex(row => row[this.pkName] == record[this.pkName]), 1)
          })
        }
      }
    },
    //重置操作
    handlerReset() {
      this.selectValue = ''
      this.$emit('select-change', {fieldText: this.propFieldText})
      // this.close()
    },
    //绑定一些属性值
    bindValue(){
      if (this.propDownType == 'form') {//嵌套表单
        if (this.propForm) {
          //文本框显示内容
          if (this.propFieldText) this.selectValue = this.propForm[this.propFieldText]
        }
      }else { //单元格编辑时
        const { renderOpts, row, column } = this.params
        this.selectValue = row[column.property]
      }
    },

    //设置显示值
    setSelectValue(selectValueNew){
      this.selectValue = selectValueNew
    },

    opened(){
      setTimeout(() => {
        this.show()
      }, 500)
    },
    //显示面板或对话框
    show(param){
      if (!this.propFlagDialog && !this.flagDialog && this.$refs.xDown && this.$refs.xDown.isPanelVisible()) {
        return
      }

      let tbMainSizeUser = localStorage.getItem('FortenDataviewDown_tbMainSize')
      if (tbMainSizeUser) this.tbMainSize = tbMainSizeUser
      this.keepSelectList = []


      this.btnClickDisabled = true
      this.afterLoad()
      this.$nextTick(() => {
        this.gridSearch()
      })
      this.btnClickDisabled = false
    },

    //隐藏面板或者对话框
    close() {
      if (this.propFlagDialog || this.flagDialog) {
        this.dialogVisible = false
      }else{
        this.$refs.xDown.hidePanel()
      }
    },

    setSelectValue(selectValueNew) {
      this.selectValue = selectValueNew
    },

    //表格搜索
    async gridSearch(isReset){
      let dataViewSelect = this.$refs.dataViewSelect
      let tbMain = dataViewSelect.$refs.tbMain
      let props = {}
      let tableQueries = null
      let userParam = {}
      let beforeFieldEditName = null
      let beforeFieldQueryName = null
      let beforeNullMsg = null

      if (this.propDownType == 'form') {//嵌套表单
        tableQueries = this.propTableQueries
        userParam = this.propUserParam
      }else { //单元格编辑时
        props = this.renderOpts.props
        tableQueries = props.tableQueries[this.params.column.property]
        userParam = props.userParam[this.params.column.property]

        //如果某一个编辑列为动态viewKey，则可以通过传入方法进行userParam赋值
        const { row, column } = this.params
        this.renderOpts.props.dataview.$emit("get-user-param",{row: row, column,call: (paramNew) => {
            userParam = paramNew.userParam
            tableQueries = paramNew.editQueries
          }})
      }
      if (userParam) {
        this.useMsg = userParam.useMsg
        this.viewKey = userParam.viewKey
        this.keepSelect = userParam.keepSelect
        this.pkName = userParam.pkName
        beforeFieldEditName = userParam.beforeFieldEditName
        beforeFieldQueryName = userParam.beforeFieldQueryName
        beforeNullMsg = userParam.beforeNullMsg
        if (userParam.flagDialog != undefined)  this.flagDialog = userParam.flagDialog
      }

      //处理查询参数
      let wrapper = this.$newWrapper()
      if (tableQueries) {
        wrapper.from(tableQueries)
      }

      //如果wrapper有排序，则至少需要一个查询条件
      if(wrapper._orderConditions && wrapper._orderConditions.length > 0
        && (!wrapper._queryConditions || wrapper._queryConditions.length < 1)){
        wrapper.eq('1', 1);
      }

      /**
      * beforeFieldQueryName 字段存在，说明当前下拉框属于级联类型的下拉框，那么，beforeFieldEditName 对应字段必须有值
      */
      if (beforeFieldQueryName && props.dataview) {
        let pk =props.dataview.getPrimaryKey()
        let refValue = this.params.row[beforeFieldQueryName]
        let pkValue = this.params.row[pk]
        if (!refValue) {
          this.btnClickDisabled = true
          props.dataview.focusEditCell(beforeFieldEditName)
          //聚焦到前一个关联输入框
          // this.utilMessage.warning(beforeNullMsg ? beforeNullMsg : '请先选择相关字段')
          this.close()
          return
        }

        //关联查询条件
        wrapper.eq(beforeFieldQueryName, refValue)
      }

      //重置分页数量，(触发按钮到底部最大高度-表单区域高度-分页高度)/表格行高度，对话框时，最大分页数量
      let userinpEl = $(this.$refs.userinpEl.$el)
      let xh=$(window).height()-(userinpEl.height()+userinpEl.offset().top) - 90 - 50

      let pageSize = Math.round(xh / 40 )

      //1920分辨率下，即便触发按钮在弹框最上部，显示超过10列，界面看起来不协调，所以最多显示10条
      if (pageSize >10) pageSize = 10

      //弹框时，最显示最多数量
      if (this.propFlagDialog || this.flagDialog) pageSize = Math.ceil(window.innerHeight/50 )

      //经过上面几部，如果分页数量小于5 条，则显示为5条
      if(!pageSize || pageSize < 5) pageSize = 5
      this.$refs.dataViewSelect.tablePage.pageSize = pageSize
      this.$refs.dataViewSelect.tablePage.showPagination = true

      //表单尺寸
      this.tbMainSizeChange()
      this.$refs.dataViewSelect.userParam = userParam
      this.$refs.dataViewSelect.isBookedData = true
      this.$refs.dataViewSelect.queryWrapper = wrapper

      //加载表结构


      if (!this.propAutoFetchData) this.useMsg += ` <span>请手动查询数据!</span>`
      await this.$refs.dataViewSelect.fetchStru(this.viewKey, this.propAutoFetchData)
      // this.$refs.dataViewSelect.setQueryWrapper(wrapper)
    },

    //视图加载后，进行一些必要的设置
    viewReady() {
      let dataViewSelect = this.$refs.dataViewSelect
      let tbMain = dataViewSelect.$refs.tbMain
      let props
      let tableQueries
      let userParam
      //选择类型，不传的话则为默认值 单选
      let checkType
      if (this.propDownType == 'form') {//嵌套表单
        checkType = this.propCheckType
        userParam = this.propUserParam
      }else { //单元格编辑时
        props = this.renderOpts.props
        tableQueries = props.tableQueries[this.params.column.property]
        userParam = props.userParam[this.params.column.property]
        //如果某一个编辑列为动态viewKey，则可以通过传入方法进行userParam赋值
        const { row, column } = this.params
        this.renderOpts.props.dataview.$emit("get-user-param",{row: row, column,call: (paramNew) => {
            userParam = paramNew.userParam
            tableQueries = paramNew.editQueries
          }})

        //选择类型，不传的话则为默认值 单选
        checkType = userParam.checkType
        //所选行属性不为空，则为编辑模式
        if(row && strings.isNotBlank(row[this.params.column.property])) {
          checkType = 'radio'
        }
      }

      //是否显示子网格复选框
      if (userParam.showChildCheckbox != undefined)  this.showChildCheckbox = userParam.showChildCheckbox

      //隐藏显示单选/复选按钮
      if(!checkType || checkType == 'radio') {
        this.isRadio = true
        dataViewSelect.ocSetShowCheckBox(false)
        dataViewSelect.ocSetShowRadioBox(true)
        dataViewSelect.showRadiobox = true
      }else{
        dataViewSelect.ocSetShowRadioBox(false)
        dataViewSelect.ocSetShowCheckBox(true)
        dataViewSelect.showCheckbox = true
        this.isRadio = false
      }

      if (this.showChildCheckbox) dataViewSelect.showChildCheckbox = true
      this.$refs.dataViewSelect.ocFocus()

      setTimeout(() => {
        if(userParam) {
          // //隐藏一些列
          if (userParam.hideColumns){
            userParam.hideColumns.split(',').forEach(fieldName => {
              tbMain.hideColumn(tbMain.getColumnByField(fieldName))
            })
          }
        }

        //下拉表格靠近浏览器最右侧时，有的时候不可见
        try {
          let pulldown = $(this.$refs.dataViewSelect.$el).closest('.vxe-pulldown--panel')
          if (window.innerWidth-pulldown.offset().left < pulldown.width()) {
            pulldown.css('left','20px' )
            pulldown.css('right','20px' )
            pulldown.css('width',pulldown.outerWidth()+'px' )
          }
        }catch (e) {

        }


      }, 500)
      this.dataViewShow = true
      setTimeout(() => {
        //选中第一个输入框
        if (this.$refs.dataViewSelect && this.$refs.dataViewSelect.$el) {
          let inpFirst = $(this.$refs.dataViewSelect.$el).find('.el-input__inner:first')
          if(inpFirst.length>0) inpFirst.focus()
        }

      }, 500)
    },

    //视图加载完毕
    afterLoad() {
      if (this.propFlagDialog || this.flagDialog) {
        this.dialogVisible = true
      }else{
        if (!this.$refs.xDown.isPanelVisible()) this.$refs.xDown.showPanel()
      }
    },

    tbMainSizeChange() {
      //表单尺寸
      this.$refs.dataViewSelect.tbMainSize = this.cpTbMainSize
      localStorage.setItem('FortenDataviewDown_tbMainSize', this.tbMainSize)
    },

    hidePanelFun({$event}) {
      //dataview编辑 鼠标按下，表示为日期控件
      let box1 =  $($event.target).closest('.vxe-table--ignore-clear')
      // 点击  下拉组件,不关闭
      let parentBox = ''
      try {
        parentBox = box1.prevObject.parent()[0].className
      } catch (e) {
        parentBox = ''
      }
      if (!this.propFlagDialog && $event.type == 'mousedown' && parentBox.indexOf("el-select-dropdown")!=-1){
        this.$refs.xDown.showPanel()
      }
      if (!this.propFlagDialog && $event.type == 'mousedown' && box1.hasClass('type--date') && this.propDownType != 'form')  {
        this.$refs.xDown.showPanel()
      }
      return false
    },

    //在点击右侧清除按钮时触发该事件，目前只实现嵌套表单时清空并进行搜索，即嵌套在FortenDataviewDownSelect.vue
    inpClear() {
      this.$emit('select-change',{row : {name: null}})
      this.selectValue = ''
      this.close()
    }
  },
  computed: {
    //自定义列
    myPropCustomCols(){
      return [
        {
          name: 'stockCount',
          cmode: 'edit'
        },
        {
          name: 'canUseCount',
          cmode: 'edit'
        },
        {
          name: 'stockLockCount',
          cmode: 'edit'
        }
      ]
    },
    cpTbMainSize() {
      switch (this.tbMainSize) {
        case "大":
          return 'medium'
        case "中":
          return 'small'
        case "小":
          return 'mini'
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .vxe-pulldown--panel {
    z-index: 10000 !important;
  }

  .edit-down-pulldown {
    width: 100% !important;
  }
  .my-dropdown4 {
    position: relative;
    left: 5%;
    background-color: #fff;
    border: 1px solid #dcdfe6;
    box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
    padding: 0px 5px;
    width: 80%;
  }
  /*更改dataview样式*/
  .data-view-select{
    /deep/ .vxe-grid{
      .vxe-grid--toolbar-wrapper{
        padding-left: 11px;
      }

      .vxe-toolbar{
      }

      .vxe-grid--toolbar-wrapper,.vxe-toolbar,.vxe-button--wrapper{
        height: auto;
      }
      .vxe-form--item{
        padding: 0px 5px;
      }
    }
  }


  .edit-down-input{
    width: 100%;
    /*更改输入框为手型*/
    .vxe-input--inner,.vxe-input--suffix{
      cursor: pointer;
    }
    .vxe-input--inner{
      /*跟表单区域宽度保持一致*/
      width: 106%;
    }
    .vxe-input--suffix{
      right: 0px;
    }
  }

  .edit-down-input-readonly /deep/{
    .vxe-input--inner[disabled]{
      text-align: center !important;
      background-color: transparent !important;
    }
  }
</style>
